<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :md="6" :sm="8">
            <a-form-item label="姓名">
              <a-input placeholder="请输入用户姓名" v-model="queryParam.realname"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="6" :sm="8">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <!-- <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
              </a> -->
            </span>
          </a-col>

        </a-row>
      </a-form>
    </div>
    <!-- 操作按钮区域 -->
    <div class="table-operator" style="border-top: 5px">
      <!-- <a-button type="primary" icon="download" @click="handleExport()">导出</a-button> -->
      <a-button type="primary" icon="download" @click="handleExportXls('薪资列表')">导出</a-button>
    </div>
    <!-- table区域-begin -->
    <div>
      <a-table
        ref="table"
        bordered
        :scroll="{x: 1500}"
        size="middle"
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
      >
      </a-table>
    </div>
  </a-card>
</template>

<script>
  import { getAction, downFile } from '@/api/manage'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  export default {
    name: 'SalaryReportStatistics',
    mixins: [JeecgListMixin],
    components: {},
    data() {
      return {
        description: '这是薪资报表',
        queryParam: {},
        recycleBinVisible: false,
        columns: [],
        url: {
          list: '/salary/salaryReport/pageList',
          exportXlsUrl: '/salary/salaryReport/exportXls'
        }
      }
    },
    computed: {},
    created() {
      this.fetchHeadColumns()
    },
    methods: {
      edit (record) {
        // console.log('record', record)
        this.queryParam = { ...this.queryParam, reportId: record.id }
        this.loadData()
      },
      fetchHeadColumns() {
        getAction('/salary/salaryReport/reportHead').then((res) => {
          const columns = res.result.cloumns.map((item) => {
            if (item.children) {
              item.children = item.children.map((childItem) => {
                return { ...childItem, title: childItem.fieldName, dataIndex: childItem.fieldCode, align: 'center' }
              })
            }
            return { ...item, title: item.fieldName, dataIndex: item.fieldCode, align: 'center' }
          })
          this.columns = columns
        })
      }
      // handleExport() {
        // window.location.href = `${window._CONFIG['domianURL']}/salary/salaryReport/exportXls?reportId=${this.queryParam.reportId}`
      //   downFile('/salary/salaryReport/exportXls', { reportId: this.queryParam.reportId })
      // }
    }
  }
</script>
<style scoped>
  @import '~@assets/less/common.less'
</style>
